<!--
 * @Author: zhangfan
 * @Date: 2024-06-25 18:36:08
 * @LastEditors: ***
 * @LastEditTime: 2024-06-26 14:15:22
 * @Description: 11
 * @FilePath: /demo/src/views/attrs/components/son-one.vue
-->
<template>
  <div class="son">
    <h3>我是孙组件</h3>
    这是爷爷的数据=={{data2}} <br>
    这是自己的数据=={{message}}<br>
    <button @click="toParent">传递数据给父组件</button>
  </div>
</template>
<script>
export default {
  name: 'Son',
  props: {
  // 接收父组件的数据
    data2: {
      type: String,
      default: ''
    },
    data3: {
      type: String,
      default: ''
    }
  },
  data () {
    return {
      message: 123
    }
  },
  created () {
    console.log(this.data2, this.data3, '$attrs')
  },
  methods: {
    toParent () {
    // 触发父组件的方法
      this.$emit('fun1', '我是孙组件数据')
    }
  }
}
</script>
<style scoped>
.view-contain-one {
  height: 300px;
  width: 500px;
  border: 1px solid #ccc;
}
</style>
